import {
    getReplyTableApi,
    getSelectReplyGroupListApi
} from '@/api/custcare/reply/reply'
import {
    ReplyListParam,
    SelectReplyGroup
} from '@/api/custcare/reply/ReplyModel'
import { StatusCode } from '@/http/request'
import { onMounted, reactive, nextTick, ref, onBeforeMount } from 'vue'

export default function useReplyTable() {
    // 定义列表查询的参数
    const listParam = reactive<ReplyListParam>({
        current_page: 1,
        page_size: 20,
        content: '',
        group_id: 0,
        status: '1',
        total: 0
    })
    // 表格的高度
    const tableHeight = ref(0)
    // 表格数据
    const replyTable = reactive({
        list: []
    })

    const replyGroupData = reactive({
        data: Array<SelectReplyGroup>()
    })

    const initReplyGroup = ref<SelectReplyGroup>({
        id: 0,
        name: '请选择分组'
    })

    // 获取表格数据
    const getReplyTable = async () => {
        let res = await getReplyTableApi(listParam)
        if (res && res.code == StatusCode.Success) {
            console.log('自动回复列表：', res.data.list)
            replyTable.list = res.data.list
            listParam.total = res.data.total
        }
    }

    // 页容量改变时触发
    const sizeChange = (size: number) => {
        listParam.page_size = size
        getReplyTable()
    }

    // 页数改变时触发
    const currentChange = (page: number) => {
        listParam.current_page = page
        getReplyTable()
    }

    // 搜索
    const searchBtn = () => {
        getReplyTable()
    }
    // 重置
    const resetBtn = () => {
        listParam.content = ''
        listParam.group_id = 0
        listParam.status = '1'
        getReplyTable()
    }

    // 获取回复分组数据
    const getSelectReplyGroupList = async () => {
        let res = await getSelectReplyGroupListApi()
        if (res && res.code == StatusCode.Success) {
            replyGroupData.data = res.data
            replyGroupData.data.unshift(initReplyGroup.value)
        }
    }

    // 首次加载
    onMounted(() => {
        // console.log('tagList onMounted')
        getReplyTable()
        nextTick(() => {
            tableHeight.value = window.innerHeight - 180
        })
    })

    onBeforeMount(async () => {
        await getSelectReplyGroupList()
    })

    return {
        replyGroupData,
        listParam,
        resetBtn,
        searchBtn,
        tableHeight,
        replyTable,
        getReplyTable,
        sizeChange,
        currentChange
    }
}
